// 登录

<template>
	<view>
		<view class="title-box">登录</view>
		<!-- 输入框 -->
		<view class="input-box">
			<icon-input icon="icon-shouji" type="text" placeholder="用户名/手机号" v-model="postForm.account"></icon-input>
			<icon-input icon="icon-mima" type="password" placeholder="请输入密码" v-model="postForm.password"></icon-input>
			<view class="input-check">
				<u-checkbox size="30" active-color="#fe492f" label-size="24" v-model="agreementChecked">
					<text style="color: #999">登录即代表阅读并同意</text>
				</u-checkbox>
				<view>
					<text @click="goagreement('agreement')">《用户协议》</text> 和
					<text @click="goagreement('privacy')">《隐私协议》</text>
				</view>
			</view>
		</view>
		<!-- 按钮 -->
		<view class="btn-box">
			<view class="btn btn1" @tap="login">立即登录</view>
			<view class="btn btn2" @tap="$u.throttle(wechatLogin, 600)">
				<view class="t-icon t-icon-weixin"></view>微信登录
			</view>
			<view class="btn3">
				<text @tap="forgetPassword">忘记密码</text>
			</view>
			<view class="btn4">
				<text @tap="demonstration">暂不登陆，进行演示</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				agreementChecked: false,
				postForm: {
					account: '',
					password: ''
				},
				code: '',
				loginFlag: false,
			}
		},
		onLoad() {
			// 判断登录是否过期
			const token = uni.getStorageSync('token')
			const userInfo = uni.getStorageSync('userInfo')
			const timeStamp = parseInt(Date.now() / 1000)
			if (token && userInfo && timeStamp < userInfo.expiretime) {
				uni.switchTab({
					url: '/pages/home/index'
				})
			}

			uni.login({
				provider: 'weixin',
				success: (res) => {
					this.code = res.code
				}
			})
		},
		methods: {
			//演示登录
			async demonstration() {
				if (!this.agreementChecked) {
					return uni.showToast({
						title: '请阅读并勾选协议',
						icon: 'none'
					})
				}
				const res = await this.$http.post('/api/kuyou/order/user/login', {
					account: 'demo',
					password: '123456'
				})
				if (res.code == 1) {
					uni.showToast({
						title: res.msg,
						icon: 'success',
						mask: true
					})
					uni.setStorageSync('userInfo', res.data.userinfo)
					uni.setStorageSync('token', res.data.userinfo.token)
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/home/index'
						})
					}, 600)
				} else if (res.code == 0) {
					return uni.showToast({
						title: res.msg,
						icon: 'none'
					})
				}
			},
			// 隐私协议
			async goagreement(e) {
				if (e == 'agreement') {
					uni.navigateTo({
						url: '/pages/my/commonFunction/agreement/user'
					})
				}
				if (e == 'privacy') {
					uni.navigateTo({
						url: '/pages/my/commonFunction/agreement/Privacy'
					})
				}
			},
			// 获取用户信息
			async getUserInfo() {
				const res = await this.$http.post('/api/kuyou/order/user/userInfo')
				if (res.code == 200) return res.data.userinfo
			},
			// 立即登录
			async login() {
				if (!this.agreementChecked) {
					return uni.showToast({
						title: '请阅读并勾选协议',
						icon: 'none'
					})
				}

				if (!this.postForm.account) {
					return uni.showToast({
						title: '请输入用户名或手机号',
						icon: 'none'
					})
				}

				if (!this.postForm.password) {
					return uni.showToast({
						title: '请输入密码',
						icon: 'none'
					})
				}

				const res = await this.$http.post('/api/kuyou/order/user/login', this.postForm)
				if (res.code == 0) {
					return uni.showToast({
						title: res.msg,
						icon: 'none'
					})
				} else if (res.code == 1) {
					uni.showToast({
						title: res.msg,
						icon: 'success',
						mask: true
					})
					uni.setStorageSync('loginFlag', true)
					uni.setStorageSync('userInfo', res.data.userinfo)
					uni.setStorageSync('token', res.data.userinfo.token)
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/home/index'
						})
					}, 600)
				}
			},
			// 微信登录
			wechatLogin() {
				if (!this.agreementChecked) {
					return uni.showToast({
						title: '请阅读并勾选协议',
						icon: 'none'
					})
				}
				if (this.loginFlag) {
					return
				}
				this.loginFlag = true;
				uni.getUserProfile({
					desc: 'Wexin',
					success: async (userProfile) => {
						// 检查登录状态是否过期
						uni.checkSession({
							success: (result) => {},
							fail: (error) => {
								uni.login({
									provider: 'weixin',
									success: (loginRes) => {
										this.code = loginRes.code
									}
								})
							},
							complete: async () => {
								// 1 小程序登陆获取session_key
								const sessionKeyRes = await this.$http.post(
									'/api/kuyou/order/weixin/getWxMiniProgramSessionKey', {
										autoLogin: 'true',
										code: this.code
									}
								)
								if (sessionKeyRes.code == 200) {
									if (!sessionKeyRes.data.token) {
										// 2.1 小程序登陆无token时重新登陆
										const noTokenRes = await this.$http.post(
											'/api/kuyou/order/weixin/wxMiniProgramOauth', {
												encryptedData: userProfile.encryptedData,
												iv: userProfile.iv,
												signature: userProfile.signature,
												event: 'login',
												session_key: sessionKeyRes.data.session_key
											}
										)
										if (noTokenRes.code == 200 && noTokenRes.data.userinfo
											.token) {
											uni.setStorageSync('loginFlag', true)
											uni.setStorageSync('token', noTokenRes.data.userinfo
												.token)
											uni.setStorageSync('userInfo', noTokenRes.data
												.userinfo)
											uni.showToast({
												title: '登录成功',
												icon: 'success',
												mask: true
											})
											setTimeout(() => {
												uni.switchTab({
													url: '/pages/home/index'
												})
											}, 600)
										} else if (noTokenRes.code == 209) {
											uni.showToast({
												title: '您还没有绑定手机号',
												icon: 'error',
												mask: true
											})
										}
									} else {
										// 2.2 小程序登陆通过token获取用户信息
										uni.setStorageSync('loginFlag', true)
										uni.setStorageSync('token', sessionKeyRes.data.token)
										const userInfo = await this.getUserInfo()
										uni.setStorageSync('userInfo', userInfo)
										uni.showToast({
											title: '登录成功',
											icon: 'success',
											mask: true
										})
										setTimeout(() => {
											uni.switchTab({
												url: '/pages/home/index'
											})
										}, 600)
									}
								}
							}
						})
					}
				})
			},
			// 忘记密码
			forgetPassword() {
				if (!this.agreementChecked) {
					return uni.showToast({
						title: '请阅读并勾选协议',
						icon: 'none'
					})
				}

				uni.navigateTo({
					url: '/pages/my/commonFunction/accountManagement/changePassword'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.title-box {
		margin: 80rpx 60rpx 52rpx;
		font-size: 40rpx;
		font-weight: 600;
		color: #111111;
	}

	/deep/ .u-checkbox {
		.u-checkbox__label {
			margin-right: 0;
		}
	}

	// 输入框
	.input-box {
		.input-check {
			display: flex;
			align-items: center;
			margin-top: 38rpx;
			padding-left: 60rpx;

			view {
				font-size: 24rpx;
				color: #999;

				text {
					color: #fe492f;
				}
			}
		}
	}

	// 按钮
	.btn-box {
		margin: 0 auto;
		width: 630rpx;

		.btn {
			display: flex;
			justify-content: center;
			align-items: center;
			height: 80rpx;
			border-radius: 50rpx;
			font-size: 36rpx;
			font-weight: 500;

			&.btn1 {
				margin: 82rpx 0 40rpx;
				color: #ffffff;
				background: #fe492f;
			}

			&.btn2 {
				margin-bottom: 60rpx;
				color: #fe492f;
				border: 1px solid #fe492f;

				.t-icon-weixin {
					margin-right: 12rpx;
					width: 46rpx;
					height: 46rpx;
				}
			}
		}

		.btn3 {
			display: flex;
			justify-content: center;
			color: #fe492f;

			text {}
		}

		.btn4 {
			position: absolute;
			bottom: 120rpx;
			color: #fe492f;
			left: 50%;
			transform: translateX(-50%);

			text {
				font-weight: 400;
				font-size: 28rpx;
			}
		}
	}
</style>
